<script setup lang="ts">
import { RouterLink, RouterView } from 'vue-router'
import { zhCN, dateZhCN } from 'naive-ui'
import type { GlobalThemeOverrides } from 'naive-ui'

const themeOverrides: GlobalThemeOverrides = {
  common: {
    primaryColor: 'skyblue',
    primaryColorHover: 'skyblue'
  },
  Button: {

  }
}
</script>

<template>
  <n-config-provider :theme-overrides="themeOverrides" :locale="zhCN" :date-locale="dateZhCN">
    <header>
      <nav>
        <RouterLink to="/">小试牛刀</RouterLink>
        <RouterLink to="/about">思极地图</RouterLink>
        <RouterLink to="/axios">axios应用</RouterLink>
      </nav>
    </header>
    <n-message-provider>
      <RouterView />
    </n-message-provider>
  </n-config-provider>
</template>

<style scoped>
header {
  line-height: 1.5;
  max-height: 100vh;
  position: sticky;
  left: 0;
  top: 0;
  background: #fff;
}
</style>
